<!--
  ~ Electronic Logistics Management Information System (eLMIS) is a supply chain management system for health commodities in a developing country setting.
  ~
  ~ Copyright (C) 2015  John Snow, Inc (JSI). This program was produced for the U.S. Agency for International Development (USAID). It was prepared under the USAID | DELIVER PROJECT, Task Order 4.
  ~
  ~ This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~
  ~ This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~
  ~ You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <http://www.gnu.org/licenses/>.
  -->

<div class="rnr-table">

  <div class="pull-right">
    <label class="checkbox">
      <input ng-model="showReports" type="checkbox">
      <span openlmis-message="label.vaccine.ivd.coverage.show.reports"></span>
    </label>
  </div>
  <h2>
    <span openlmis-message="label.vaccine.coverage"></span>
  </h2>
  <div adjust-height bottom-offset="180" tab-scroll>
    <div class="float-left left-table parent">
      <table class="table table-bordered" fixed-table-header id="fullSupplyFrozenTable">
        <thead>
          <tr>
            <th colspan="2">&nbsp;</th>
          </tr>
          <tr>
            <th colspan="2">&nbsp;</th>
          </tr>
          <tr>
            <th openlmis-message="label.vaccine.coverage.product"></th>
            <th openlmis-message="label.vaccine.coverage.dose"></th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat-start="(productId, productGroup) in report.coverageLineItemViews"></tr>
          <tr ng-repeat-start="dose in productGroup">
            <td class="col-product cell-input" ng-if="$index == 0" rowspan="{{productGroup.length * 2}}">
              <span class="cell-text">{{dose.product.primaryName}}</span>
            </td>
            <td class="cell-input">
              <span class="cell-text number" style="min-height: 31px;">{{dose.displayName}}</span>
            </td>
          </tr>
          <tr ng-repeat-end></tr>
          <tr ng-repeat-end></tr>
        </tbody>
      </table>
    </div>

    <div class="float-left right-table parent" custom-horizontal-scroll>
      <ng-include ng-show="showReports" src="'/public/pages/vaccine/report/partials/create/coverage-with-reporting.html'"></ng-include>
      <ng-include ng-show="!showReports" src="'/public/pages/vaccine/report/partials/create/coverage-data-entry-only.html'"></ng-include>
    </div>
  </div>
</div>
<div class="clearfix"><br/></div>
<div class="row-fluid">
  <div class="span4">
    <table class="table table-bordered" style="margin-bottom: 0px; padding-bottom: 0px">
      <thead>
        <tr>
          <th colspan="3" openlmis-message="vaccine.immunization.sessions"></th>
        </tr>
        <tr>
          <th class="span2" openlmis-message="vaccine.immunization.sessions.fixed"></th>
          <th class="span2" openlmis-message="vaccine.immunization.sessions.outreach"></th>
          <th class="span2" openlmis-message="vaccine.immunization.sessions.canceled.outreach"></th>
          <th class="span2" openlmis-message="vaccine.immunization.sessions.canceled.percentage"></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="cell-input col-general">
            <input maxlength="8" ng-model="report.fixedImmunizationSessions" numeric-validator="positiveInteger" type="text">
          </td>
          <td class="cell-input col-general">
            <input maxlength="8" ng-model="report.outreachImmunizationSessions" numeric-validator="positiveInteger" type="text">
          </td>
          <td class="cell-input col-general">
            <input maxlength="8" ng-model="report.outreachImmunizationSessionsCanceled" numeric-validator="positiveInteger" type="text">
          </td>
          <td class="cell-input col-general number">
            {{ ((report.outreachImmunizationSessions != 0)? (report.outreachImmunizationSessionsCanceled * 100 / report.outreachImmunizationSessions) : 0) | number : '2' }} %
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
<div class="clearfix"><br/></div>
<div>
  <div openlmis-message="label.vaccine.major.immunization.activities"></div>
  <textarea class="span12" ng-model="report.majorImmunizationActivities" rows="5"></textarea>
</div>
